<template>
  <div :style="styleCss">
    <!-- <el-tabs v-model="activeNameA" :style="styleCss">
        <el-tab-pane label="全部课程" name="全部">
            
        </el-tab-pane>
        <el-tab-pane label="视频课程" name="视频">
            <pickList ref="视频" :activeName='activeNameA' @msidBox='msidBox' :idSad='idSad' :tabLabel='tabLabel'></pickList>
        </el-tab-pane>
        <el-tab-pane label="电子课件" name="课件">
            <pickList  ref="课件" :activeName='activeNameA' @msidBox='msidBox' :idSad='idSad' :tabLabel='tabLabel'></pickList>
        </el-tab-pane>
        <el-tab-pane label="收藏课件" name="收藏">
            <pick ref="收藏" @fileLists='fileList' @loading='loadingpack' :tabLabel='tabLabel'></pick>
            <collectionA :fileList='list' @pagination='pagination' :subjctid='subjctid' :loading='loading'></collectionA>
        </el-tab-pane>
    </el-tabs> -->
    <!-- <el-button @click="changeTab('全部')">全部课程</el-button>
      <el-button @click="changeTab('视频')">视频课程</el-button>
      <el-button @click="changeTab('课件')">电子课件</el-button>
      <el-button @click="changeTab('收藏')">收藏课件</el-button> -->

    <!--   style="position: absolute;top:0;left:258px;" -->
    <slot></slot>
    <pick
      ref="pickList"
      :activeName="activeNameA"
      @msidBox="msidBox"
      :idSad="croueid"
      :tabLabel="tabLabel"
    ></pick>
    <!-- <div v-else>
            <pick ref="收藏" @fileLists='fileList' @loading='loadingpack' :tabLabel='tabLabel'></pick>
      </div> -->
    <!-- <collectionA
      ref="collectionA"
      v-else
      :activeName="activeNameA"
      @msidBox="msidBox"
      :idSad="idSad"
      :tabLabel="tabLabel"
    ></collectionA> -->
  </div>
</template>

<script>
import pick from "./pick.vue";
import pickList from "./pickList.vue";
import collectionA from "./collection.vue";
import eventBus from "@/utils/eventBus";
import { getsubject_id, getsubjectTitle } from "@/utils/auth";
import { mapGetters } from "vuex";
export default {
  props: ["styleCss", "tabLabel", "croueid", "titleA", "isSuer",'activeNameA'],
  components: {
    pick,
    collectionA,
    pickList,
  },
  computed: { ...mapGetters(["tab"]) },
  watch: {
    activeNameA(val) {
      this.$nextTick(() => {
        this.$refs.pickList.listData();
      });
      this.$emit("update:titleA", val);
    },
    // titleA(val){
    //   this.activeNameA=val
    // }
  },
  data() {
    return {
      value: "老王",
      list: [],
      page: 1,
      limit: 5,
      total: 0,
      subjctid: "",
      loading: false,
      subID: "",
      idSad: "",
    };
  },
  methods: {
    fileList(list, total, subjctid) {
      this.list = list;
      this.total = total;
      this.subjctid = subjctid;
    },
    pagination(data) {
      this.page = data.page;
      this.limit = data.limit;
    },
    loadingpack(data) {
      this.loading = data;
    },
    changesubjct(id) {
      this.subID = id;
      this.$refs.pickList.listData(id);
    },
    msidBox(id) {
      // this.idSad = id;
      this.$emit("upId", id);
    },
    listValue(val) {
      this.$refs.pickList.listData();
      this.$forceUpdate();
    },
  },
  mounted() {
    if (this.subID) {
      // this.$refs.视频.listData(this.subID)
    } else {
      // this.$refs.pickList.listData()
    }

    // if (this.tab) {
    //   this.activeNameA = this.tab;
    // }
  },
};
</script>


<style lang="scss" scoped>
::v-deep {
  .el-input-group__append {
    background: none !important;
    border-color: none;
    color: #3b7cff !important;
  }
  .el-tabs__content {
    height: calc(100% - 55px);
    .el-tab-pane {
      height: 100%;
    }
  }
  .el-radio-button {
    margin-bottom: 20px !important;
    margin-right: 30px !important;
    .el-radio-button__inner {
      border: none !important;
      border-radius: 4px;
      padding: 10px 0;
    }
  }
  .el-radio-button__orig-radio:checked + .el-radio-button__inner {
    border-radius: 4px;
    border: none !important;
    background: none !important;
    color: #3b7cff;
    box-shadow: none !important;
  }
}
</style>